<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>品优购-商品详情页面</title>
  <link rel="shortcut icon" href="favicon.ico">
  <!-- 引入外部css样式文件 -->
  <!-- 先引入兼容的css样式文件，再引入初始化样式文件，再引入第三方样式文件，再引入模板页面css样式，再引入当前页面css文件 -->
  <!-- 引入兼容css文件 -->
  <link rel="stylesheet" href="../css/normalize.css">
  <!-- 引入初始化样式文件 -->
  <link rel="stylesheet" href="../css/base.css">
  <!-- 引入模板页面样式文件 -->
  <link rel="stylesheet" href="../css/module.css">
  <!-- 引入当前页面css文件 -->
  <link rel="stylesheet" href="../css/productDtail.css">
</head>
<body>
  <!-- 头部的快捷导航栏部分开始 -->
  <div class="shortcut">
    <div class="w">
      <div class="shortcut_wel fl">
        <span>品优购欢迎您!</span>
        <a href="#" class="user_login">请登录</a>
        <a href="#" class="col_rd">免费注册</a>
      </div>
      <div class="shortcut_nav fr">
        <ul>
          <li><a href="#">我的订单</a></li>
          <li class="line"></li>
          <li><a href="#">我的品优购</a><i class="iconfont">&#xe6a6;</i></li>
          <li class="line"></li>
          <li><a href="#">品优购会员</a></li>
          <li class="line"></li>
          <li><a href="#">企业采购</a></li>
          <li class="line"></li>
          <li><a href="#">关注品优购</a><i class="iconfont">&#xe6a6;</i></li>
          <li class="line"></li>
          <li>客户服务<i class="iconfont">&#xe6a6;</i></li>
          <li class="line"></li>
          <li>网站导航<i class="iconfont">&#xe6a6;</i></li>
        </ul>
      </div>
    </div>
  </div>
  <!-- 头部的快捷导航栏部分结束 -->


  <!-- 头部部分开始 -->
  <div class="nav_top">
    <div class="w pr">
      <div class="logo">
        <h1>
          <a href="#">品优购</a>
        </h1>
      </div>
      <div class="search">
        <input type="text" placeholder="语言开发">
        <input type="button" value="搜索">
      </div>
      <div class="cart">
        <i class="iconfont car">&#xe698;</i>
        <a href="#" class="myCar">我的购物车</a>
        <i class="iconfont">&#xe6a7;</i>
        <span class="buy_num">8</span>
      </div>
      <div class="hotwrods">
        <ul>
          <li><a href="#" class="col_rd">女神美颜季</a></li>
          <li><a href="#">洗手节</a></li>
          <li><a href="#">满99减50</a></li>
          <li><a href="#">畅享9p</a></li>
          <li><a href="#">荣耀平板</a></li>
          <li><a href="#">老年鞋</a></li>
          <li><a href="#">满千减百</a></li>
        </ul>
      </div>
      <div class="nav_top_nav">
        <ul>
          <li><a href="#">秒杀</a></li>
          <li><a href="#">优惠券</a></li>
          <li><a href="#">PLUS会员</a></li>
          <li><a href="#">闪购</a></li>
          <li><a href="#">拍卖</a></li>
          <li><a href="#">品优购服饰</a></li>
          <li><a href="#">品优购超市</a></li>
          <li><a href="#">品优购生鲜</a></li>
        </ul>
      </div>
      <div class="main_nav fl">
        <h3>全部商品分类</h3>
        <ul>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
          <li><a href="#">家用电器 <i class="iconfont fr">&#xe6a7;</i></a></li>
        </ul>
      </div>
    </div>
  </div>
  <!-- 头部部分结束 -->



  <!-- main部分开始 -->
   <div class="main w">
     <div class="crumb-wrap clearfix">
       <ul>
         <li><a href="#">手机、数码、通讯</a></li>
         <li class="icon"><i class="iconfont">&#xe6a7;</i></li>
         <li><a href="#">手机</a></li>
         <li class="icon"><i class="iconfont">&#xe6a7;</i></li>
         <li><a href="#">Apple苹果</a></li>
         <li class="icon"><i class="iconfont">&#xe6a7;</i></li>
         <li>iPhone XS Plus系列</li>
       </ul>
     </div>
     <div class="product-intro clearfix">
       <div class="preview-wrap fl">
         <div class="preview-img pr">
            <ul>
              <li><img src="../upload/b1.png" alt=""></li>
              <li><img src="../upload/b2.png" alt=""></li>
              <li><img src="../upload/b3.png" alt=""></li>
              <li><img src="../upload/b2.png" alt=""></li>
              <li><img src="../upload/b3.png" alt=""></li>
            </ul>
         </div>
         <div class="preview-list clearfix">
           <ul>
             <li class="arrow_l"><img src="../upload/disabled-prev.png" alt=""></li>
             <li class="mar"><img src="../upload/s1.png" alt=""></li>
             <li class="mar"><img src="../upload/s2.png" alt=""></li>
             <li class="mar"><img src="../upload/s3.png" alt=""></li>
             <li class="mar"><img src="../upload/s2.png" alt=""></li>
             <li class="mar"><img src="../upload/s3.png" alt=""></li>
             <li class="arrow_r"><img src="../upload/disabled-next.png" alt=""></li>
           </ul>
         </div>
         <div class="preview_text clearfix">
           <ul>
             <li>商品编码：04682554512</li>
             <li class="share"><i class="iconfont">&#xe64e;</i> 分享</li>
             <li class="takeEye"><i class="iconfont">&#xe663;</i> 收藏</li>
             <li><input type="checkbox"> 对比</li>
           </ul>
         </div>
       </div>


       <div class="itemInfo-wrap fr"></div>
     </div>
   </div>
  <!-- main部分结束 -->


  <!-- 底部部分开始 -->
  <div class="footer">
    <div class="w">
      <div class="mod_service">
        <ul class="clearfix">
          <li class="clearfix">
            <h3>正品保障</h3>
            <div class="service_text fl">
              <h4>正品保障</h4>
              <span>正品保障，提供发票</span>
            </div>
          </li>
          <li class="clearfix">
            <h3>极速物流</h3>
            <div class="service_text fl">
              <h4>正品保障</h4>
              <span>正品保障，提供发票</span>
            </div>
          </li>
          <li class="clearfix">
            <h3>无忧售后</h3>
            <div class="service_text fl">
              <h4>正品保障</h4>
              <span>正品保障，提供发票</span>
            </div>
          </li>
          <li class="clearfix">
            <h3>特殊服务</h3>
            <div class="service_text fl">
              <h4>正品保障</h4>
              <span>正品保障，提供发票</span>
            </div>
          </li>
          <li class="clearfix">
            <h3>帮助中心</h3>
            <div class="service_text fl">
              <h4>正品保障</h4>
              <span>正品保障，提供发票</span>
            </div>
          </li>
        </ul>
      </div>
      <div class="mod_service_item clearfix">
        <dl>
          <dt>购物指南</dt>
          <dd><a href="#">购物流程</a></dd>
          <dd><a href="#">会员介绍</a></dd>
          <dd><a href="#">生活旅行/团购</a></dd>
          <dd><a href="#">常见问题</a></dd>
          <dd><a href="#">大家电</a></dd>
          <dd><a href="#">联系客服</a></dd>
        </dl>
        <dl>
          <dt>配送方式</dt>
          <dd><a href="#">上门自提</a></dd>
          <dd><a href="#">211限时达</a></dd>
          <dd><a href="#">配送服务查询</a></dd>
          <dd><a href="#">配送费收取标准</a></dd>
          <dd><a href="#">海外配送</a></dd>
        </dl>
        <dl>
          <dt>支付方式</dt>
          <dd><a href="#">货到付款</a></dd>
          <dd><a href="#">在线支付</a></dd>
          <dd><a href="#">分期付款</a></dd>
          <dd><a href="#">邮局汇款</a></dd>
          <dd><a href="#">公司转账</a></dd>
        </dl>
        <dl>
          <dt>售后服务</dt>
          <dd><a href="#">售后政策</a></dd>
          <dd><a href="#">价格保护</a></dd>
          <dd><a href="#">退款说明</a></dd>
          <dd><a href="#">返修/退换货</a></dd>
          <dd><a href="#">取消订单</a></dd>
        </dl>
        <dl>
          <dt>特色服务</dt>
          <dd><a href="#">夺宝岛</a></dd>
          <dd><a href="#">DIY装机</a></dd>
          <dd><a href="#">延保服务</a></dd>
          <dd><a href="#">品优购E卡</a></dd>
          <dd><a href="#">品优购通信</a></dd>
        </dl>
        <dl>
          <dt>帮助中心</dt>
          <dd class="ac">
            <img src="../images/wx_cz.jpg" alt="">
            <span>品优购客户端</span>
          </dd>
        </dl>
      </div>
      <div class="mod_copyright">
        <ul class="clearfix">
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
          <li class="line"></li>
          <li><a href="#">关于我们</a></li>
        </ul>
        <p>地址：广州市天河区吉山街道珠吉路58号津安创意园103室 邮编：10086 电话：020-8888888 传真：020-8888888 邮箱：876899126@guang.com</p>
        <p>&copy;粤 ICP 备 08001421 号穗公网安备 110200200809</p>
      </div>
    </div>
  </div>
  <!-- 底部部分结束 -->

</body>
</html>